<template>
  <div id="cqd">
    <el-row>
      <el-table v-if="zbjcdata.name=='领导带班未巡检'" :data="table.data">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="time" label="领导进入分站时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="loc" label="分站名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="num" min-width="120" label="分站编号" show-overflow-tooltip></el-table-column>
      </el-table>

      <el-table v-if="zbjcdata.name=='疑似领导代班'" :data="table.data1">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="ldtime" label="领导进入分站时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="ldsname" label="分站名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbtime" label="代班人员进入分站时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="dbsname" label="分站名称" show-overflow-tooltip></el-table-column>
      </el-table>
      <el-table v-if="zbjcdata.name=='隐患统计'" :data="table.data3">
        <el-table-column type="index" label="序号" width="70"></el-table-column>
        <el-table-column prop="pro" label="省" show-overflow-tooltip></el-table-column>
        <el-table-column prop="mineName" min-width="120" label="煤矿名称"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="date" min-width="120" label="排查时间" show-overflow-tooltip></el-table-column>
        <el-table-column prop="level" min-width="120" label="隐患级别" show-overflow-tooltip></el-table-column>
         <el-table-column prop="qx" min-width="120" label="治理期限"  show-overflow-tooltip></el-table-column>
        <el-table-column prop="fxdType" min-width="120" label="风险点类型" show-overflow-tooltip></el-table-column>
        <el-table-column prop="des" label="隐患描述" width="260"></el-table-column>
         <el-table-column prop="fxd" label="风险点"  ></el-table-column>
         <el-table-column prop="bc" label="班次"  ></el-table-column>
        <el-table-column prop="yhlx" min-width="120" label="隐患类型" show-overflow-tooltip></el-table-column>
        <el-table-column prop="zt" min-width="120" label="整改状态" show-overflow-tooltip></el-table-column>
      </el-table>
    </el-row>
    <!-- 分页信息栏 -->
     <el-row v-if="zbjcdata.name=='隐患统计'"  class="pagination-bar">
      <el-col :span="8" class="page-info">显示第&nbsp;1&nbsp;至&nbsp;10&nbsp;项结果，共&nbsp;63&nbsp;项</el-col>
      <el-col :span="16" class="text-right">
        <el-pagination
          layout="prev,pager,next,jumper"
          :total="63"
          :current-page.sync="table.currentPage"
          :page-size="table.pageSize"
        ></el-pagination>
      </el-col>
    </el-row>
    <el-row v-else class="pagination-bar">
      <el-col :span="8" class="page-info">显示第&nbsp;{{currentStart}}&nbsp;至&nbsp;{{currentEnd}}&nbsp;项结果，共&nbsp;{{table.total}}&nbsp;项</el-col>
      <el-col :span="16" class="text-right">
        <el-pagination
          layout="prev,pager,next,jumper"
          :total="table.total"
          :current-page.sync="table.currentPage"
          :page-size="table.pageSize"
          @current-change="initData"
        ></el-pagination>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  props: {
    zbjcdata: {
      type: Object,
      default: {}
    }
  },
  data() {
    return {
      table: {
        data: [], //数据
        data1: [],
        data3:[],
        total: 0, //总条数
        total1:63,
        currentPage: 1, //当前页码
        pageSize: 10 //每页条数
      }
    };
  },
  mounted() {
    console.log(this.zbjcdata.name,"打印输出！！！！")
    if(this.zbjcdata.name=='领导带班未巡检'){
      this.initData();
    }else if(this.zbjcdata.name=='隐患统计'){
      this.initData3()
    }else{
      this.initData1();
    }
    // this.initData2();
  },
  computed: {
    // 数据起点
    currentStart() {
      return this.table.total == 0
        ? 0
        : (this.table.currentPage - 1) * this.table.pageSize + 1;
    },
    // 数据终点
    currentEnd() {
      return this.currentStart == 0
        ? 0
        : this.currentStart + this.table.pageSize - 1 > this.table.total
        ? this.table.total
        : this.currentStart + this.table.pageSize - 1;
    }
  },
  methods: {
    initData() {
      this.request({
        url: "data/getData/3.12",
        method: "get"
      }).then(data => {
        this.table.data = data.data;
        this.table.total = data.data.length;
      });
    },
    initData1() {
      this.request({
        url: "data/getData/3.10",
        method: "get"
      }).then(data => {
        this.table.data1 = data.data;
        this.table.total = data.data.length;
      });
    },
    initData2() {
      this.request({
        url: "data/getData/3.8",
        method: "get"
      }).then(data => {
        this.table.data2 = data.data;
      });
    },
     initData3() {
      this.request({
        url: "data/getData/3.33",
        method: "get"
      }).then(data => { 
        this.table.data3 = data.data.slice(0,10);
      });
    }
  }
};
</script>
<style lang="less" scoped>
#cqd /deep/ ::-webkit-scrollbar-thumb {
  background-color: #dddddd !important;
}
</style>